<template>
	<view class="">
		<van-nav-bar title="个人头像" left-arrow @tap="onClickLeft" />
		</van-nav-bar>
		<view class="">
			<open-data type="userAvatarUrl"></open-data>
		</view>
		<button class="header" type="default" @tap="uploadImg">{{header}}</button>
		<!-- 底部弹出层 -->
		<van-popup :show="show" @close="onClose" position="bottom">
			 <button class="box" @tap="photoLink">{{photograph}}</button>
			 <button class="box" @tap="uploadLink">{{uploadtext}}</button>
			 <button class="box" @tap="cancelBox">{{cancel}}</button>
		</van-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				header:'更改头像',
				photograph:'拍照',
				uploadtext:"从手机相册上传",
				cancel:'取消',
			}
		},
		methods: {
			onClickLeft() {
				uni.navigateBack({
					delta:1
				})
			},
			uploadImg() {
				this.show=true;
			},
			onClose() {
				this.show=false;
			},
			cancelBox() {
				this.show=false;
			},
			photoLink() {
				uni.navigateTo({
					url:'./camera/camera',
				})
			},
			uploadLink() {
				uni.navigateTo({
					url:'./mobileUpload/mobileUpload',
				})
			},
		}
	}
</script>

<style>
	.header {
		width: 50%;
		margin-top: 30px;
	}
	.box {
		width: 100%;
		height: 100upx;
		text-align: center;
		font-size: 16px;
		border-bottom: 1px solid #e0e0e0;
		line-height: 100upx;
		border: none;
	}
	.van-nav-bar__title {
		max-width: 40%;
		color: #3578E5;
	}
</style>
